<template>
  <div class="page-gird-container">
    <i-crud
      :data="data"
      :columns="columns"
      :page-options="pageOptions"
      :fetch-data="fetchData"
      :options="options"
      :add-form-options="addFormOptions"
      :searchOptions="searchOptions"
      :toolbarOptions="toolbarOptions"
    ></i-crud>
  </div>
</template>

<script>
    import { remittanceList } from "@/api/finance";

    export default {
        name: "finance-moneyManage-remittanceRecord",
        data() {
            return {
                pageOptions: {
                    total: 0,
                    pageSize: 20,
                    pageSizeOpts: [20, 50, 100, 200]
                },
                data: [],
                addFormOptions: {
                    show: false,
                },
                columns: [
                    {
                        title: "汇款编号",
                        key: "id",
                        width: 0
                    },
                    {
                        title: "汇款人",
                        key: "username",
                        type: "Input",
                        width: 0
                    },
                    {
                        title: "汇款银行账号",
                        key: "account",
                        type: "Input",
                        width: 0
                    },
                    {
                        title: "开户银行",
                        key: "name",
                        width: 0
                    },
                    {
                        title: "汇款金额（元）",
                        key: "money",
                        width: 0
                    },
                    {
                        title: "审核结果",
                        key: "result",
                        type: "Select",
                        dict: {
                            data: [
                                {
                                    value: "Await",
                                    label: "待审核",
                                },
                                {
                                    value: "Passed",
                                    label: "通过",
                                },
                                {
                                    value: "Refuse",
                                    label: "拒绝",
                                },
                            ],
                        },
                        render: (h, params) => {
                            let status = params.row.status;
                            if (status == "Await") {
                                status = "待审核";
                            }
                            if (status == "Passed") {
                                status = "通过";
                            }
                            if (status == "Refuse") {
                                status = "拒绝";
                            }
                            return h("span", status);
                        },
                        width: 0
                    },
                    {
                        title: "充值时间",
                        key: "create_time",
                        sortable: true,
                        width: 0
                    },
                ],
                options: {
                    border: false, // 是否显示边框
                },
                searchOptions: {
                    labelWidth: 150,
                },
            };
        },
        methods: {
            fetchData({ currentPage, pageSize, sortColumn, sortType, search }) {
                return new Promise((resolve, reject) => {
                    const page = {
                        current: currentPage,
                        size: pageSize,
                    };
                    remittanceList({
                        page,
                        search,
                    })
                        .then((res) => {
                            this.data = res.list;
                            this.pageOptions.total = res.total;
                            resolve();
                        })
                        .catch((err) => {
                            reject(new Error(err));
                        });
                });
            },
        },
    };
</script>

<style lang="less" scoped>
.page-gird-container {
  box-shadow: rgba(10, 32, 51, 0.12) 0px 1px 3px 0px;
  padding: 24px;
  background-color: #fff;
}
</style>
